
<template>
  <!-- 营销素材管理-营销素材信息反馈查询 -->
  <div>
    <!-- 搜索 -->
    <TopFilter
      ref="conditionFilter"
      :list="topFilterInit"
      :cols="3"
      labelWidth="120"
      @filterChange="changeHandle"
    ></TopFilter>

    <!-- table -->
    <FilterTable
      ref="table"
      :columns="columns"
      :isSelectColumn="isSelectColumn"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'records'"
      :onColumnsChange="columns => this.columns = columns"
    >
      <template slot="controls">
        <el-button
          size="small"
          type="primary"
          icon="el-icon-download"
          :loading="exportLoading"
          @click="requestExportData"
        >下载</el-button>
      </template>
    </FilterTable>

    <!-- 经销商弹窗 -->
    <BaseDialog
      title="经销商查询"
      :visible.sync="visibleDealer"
      width="1000px"
      destroyOnClose
      :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}"
    >
      <dealerMadal
        selectType="multiple"
        v-model="initDealerData"
        :deptId="orgId"
        :dealerType="dealerType"
        ref="dealerDialog"
        @close="closeDealer"
      />
    </BaseDialog>

    <!-- 右侧浮动详情页 -->
    <Drawer
      :visible.sync="visibleDrawer"
      title="活动营销素材反馈信息明细"
      destroyOnClose
      :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}"
    >
      <info-modal :type="handleTypeAdd" :rowData="formData" @close="closeHandler" />
    </Drawer>
  </div>
</template>

<script>
// import { getLoginUser } from '@/api/cms-api/projectOperating/program/departmentInquire'; //获取登录信息
import { dictionary } from '@/utils/dictMixin';
import dealerMadal from '@/pages/cms-common/dealerdata/dealerType';
import { getRegion } from '@/api/cms-common/dealerdata/index';
import infoModal from './info';
import { exportExcelFile } from '@/utils/index';
import { formatdateByDay } from '@/utils/index';
import { getmaterialTypeOneList, getDealerMaterialPageBySqlOEM, selectMaterialListByBill, selectFeedListByBill, getDealMaterialExcelListOEM } from '@/api/cms-api/projectOperating/program/push';
export default {
  mixins: [dictionary],
  components: {
    dealerMadal,
    infoModal
  },
  //初始化数据  全局变量
  data() {
    return {
      topFilterInit: this.topFilterInitFun(),
      visibleDealer: false,
      initDealerData: {}, //经销商弹窗参数,
      dataSource: [], //返回经销商数组
      columns: this.creatHeader(),
      isSelectColumn: false,
      fetchParams: {}, //参数
      fetchApi: getDealerMaterialPageBySqlOEM, //ipa 接口
      visibleDrawer: false,
      handleTypeAdd: '',
      formData: {},
      exportLoading: false,
      dealerCode: '',
      dealerName: '',
      orgId: null, //登录人所属组织
      dealerType: '25381001,25381002,25381003,25381004,25381005' //不包含大客户的
    };
  },
  //方法、事件
  methods: {
    //导出
    async requestExportData() {
      let r = await this.$refs.conditionFilter.GET_FORM_DATA();
      let p = null;
      if (r != null && r.length > 1) {
        p = r[1];
      }
      this.exportLoading = true;
      getDealMaterialExcelListOEM(p).then(res => {
        exportExcelFile(res.data, '营销素材信息反馈查询');
        this.exportLoading = false;
      });
    },
    //搜索数据
    topFilterInitFun() {
      return [
        {
          type: 'INPUT',
          label: '经销商名称',
          fieldName: 'dealerName',
          placeholder: '请选择',
          initialValue: '',
          readonly: true,
          unitRender: () => {
            return <el-button slot="append" icon="el-icon-search" onClick={() => this.openDialog()}></el-button>;
          }
        },
        { type: 'SELECT', label: '事业部', fieldName: 'sourceDept', placeholder: '请选择', initialValue: '', itemList: [] },
        { type: 'INPUT', label: '反馈编号', fieldName: 'feedbackCode', initialValue: '' },
        {
          type: 'SELECT',
          label: '反馈状态',
          fieldName: 'feedbackStatus',
          initialValue: '',
          itemList: this.createDictList('2527')
        },
        { type: 'INPUT', label: '营销素材代码', fieldName: 'materialCode', initialValue: '' },
        { type: 'INPUT', label: '营销素材名称', fieldName: 'materialName', initialValue: '' },
        {
          type: 'SELECT',
          label: '营销素材类型-一级',
          fieldName: 'materialTypeOne',
          placeholder: '请选择...',
          itemList: [],
          change: value => {
            this.initmaterialTypeTwo(value);
          }
        },
        {
          type: 'SELECT',
          label: '营销素材类型-二级',
          fieldName: 'materialTypeTwo',
          placeholder: '请选择...',
          itemList: [],
          change: value => {
            this.initmaterialTypeThree(value);
          }
        },
        {
          type: 'SELECT',
          label: '营销素材类型-三级',
          fieldName: 'materialTypeThree',
          placeholder: '请选择...',
          itemList: [],
          change: value => {
            this.initmaterialTypeFour(value);
          }
        },
        {
          type: 'SELECT',
          label: '营销素材类型-四级',
          fieldName: 'materialTypeFour',
          placeholder: '请选择...',
          itemList: [],
          change: value => {
            this.initmaterialTypeFive(value);
          }
        },
        { type: 'SELECT', label: '营销素材类型-五级', fieldName: 'materialTypeFive', placeholder: '请选择...', itemList: [] },
        {
          type: 'RANGE_DATE',
          label: '反馈截止日期',
          fieldName: 'feedbackEndDate',
          initialValue: ''
        }
      ];
    },
    //关闭详情
    closeHandler(val, type) {
      this.visibleDrawer = false;
      if (type === 'refresh') {
        // 重新加载
        this.fetchParams = { ...this.fetchParams };
      }
    },
    //table表头和数据源
    creatHeader() {
      return [
        {
          title: '操作',
          dataIndex: 'column-action',
          width: 100,
          fixed: 'left',
          render: (props, h) => {
            return (
              <div>
                <el-button size="mini" type="text" onClick={() => this.drawerHandle(props.row, 'show')}>
                  明细
                </el-button>
              </div>
            );
          }
        },
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '反馈状态',
          dataIndex: 'feedbackStatus',
          sorter: true,
          filterItems: this.createDictList('2527'),
          render: props => {
            //编码转汉字
            return <span>{this.createDictText(props.row.feedbackStatus, '2527')}</span>;
          }
        },
        {
          title: '经销商代码',
          dataIndex: 'dealerCode',
          sorter: true
        },
        { title: '经销商简称', dataIndex: 'dealerShortname', sorter: true },
        { title: '经销商名称', dataIndex: 'dealerName', sorter: true },
        { title: '事业部', dataIndex: 'orgName', sorter: true },
        { title: '反馈编号', dataIndex: 'feedbackCode', sorter: true },
        { title: '营销素材代码', dataIndex: 'materialCode', sorter: true },
        { title: '营销素材名称', dataIndex: 'materialName', sorter: true },
        {
          title: '反馈截止日期',
          dataIndex: 'feedbackEndDate',
          sorter: true,
          render: props => {
            return <span>{formatdateByDay(props.row.feedbackEndDate)} </span>;
          }
        },
        // {
        //   title: '营销素材类型-一级',
        //   dataIndex: 'materialTypeOne',
        //   sorter: true,
        //   hidden: true
        // },
        // {
        //   title: '营销素材类型-二级',
        //   dataIndex: 'materialTypeTwo',
        //   sorter: true,
        //   hidden: true
        // },
        // {
        //   title: '营销素材类型-三级',
        //   dataIndex: 'materialTypeThree',
        //   sorter: true,
        //   hidden: true
        // },
        // {
        //   title: '营销素材类型-四级',
        //   dataIndex: 'materialTypeFour',
        //   sorter: true,
        //   hidden: true
        // },
        // {
        //   title: '营销素材类型-五级',
        //   dataIndex: 'materialTypeFive',
        //   sorter: true,
        //   hidden: true
        // },
        {
          title: '营销素材类型-一级',
          dataIndex: 'materialTypeOneName',
          sorter: true
        },
        {
          title: '营销素材类型-二级',
          dataIndex: 'materialTypeTwoName',
          sorter: true
        },
        {
          title: '营销素材类型-三级',
          dataIndex: 'materialTypeThreeName',
          sorter: true
        },
        {
          title: '营销素材类型-四级',
          dataIndex: 'materialTypeFourName',
          sorter: true
        },
        {
          title: '营销素材类型-五级',
          dataIndex: 'materialTypeFiveName',
          sorter: true
        }
      ];
    },
    //详情
    async drawerHandle(row, type) {
      //明细
      if (type === 'show') {
        let res = {};
        this.handleTypeAdd = 'show';
        this.formData = row;
        //回显附件
        let fileParams = { id: this.formData.id, billType: 25721002 };
        res = await selectFeedListByBill(fileParams);
        if (res.data.length > 0) {
          let caseUrlList = [];
          for (let j = 0; j < res.data.length; j++) {
            let o1 = { name: res.data[j].fileName };
            let o2 = { url: res.data[j].fileId };
            let a = Object.assign(o1, o2);
            caseUrlList.push(a);
          }
          this.formData = Object.assign({}, { caseUrl: caseUrlList }, this.formData);
        }
        this.visibleDrawer = true;
      }
    },
    formatDates: function(value) {
      // 这里的 value 就是需要过滤的数据
      if (value == null || value == '') {
        return '';
      }
      var date = new Date(value);
      var year = date.getFullYear();
      var month = date.getMonth() + 1;
      var day = date.getDate();
      return year + '-' + month + '-' + day;
    },
    //获取事业部下拉列表数据
    async getDeptData() {
      const res = await getRegion();
      if (res.resultCode === 200) {
        this.topFilterInit[1].itemList = res.data.map(x => ({ value: x.orgId, text: x.orgName }));
      }
    },
    //打开经销商弹窗
    openDialog() {
      this.initDealerData = {
        excludeBigCustomer: false, //是否查询大客户经销商，如果查询 true，不查询 false
        id: 1001
      };
      this.visibleDealer = true;
    },
    //经销商窗口关闭，返回数据
    closeDealer(data) {
      if (data.data && data.data.length > 0) {
        //清空数据内容
        this.dealerCode = '';
        this.dealerName = '';
        //循环返回数据
        data.data.forEach(x => {
          //插入经销商id
          // this.dealerList.push(x.dealerId);
          //使用逗号分隔拼接经销商ID
          if (this.dealerCode == '') {
            this.dealerCode = x.dealerCode;
          } else {
            this.dealerCode += ',' + x.dealerCode;
          }

          // this.dealerList.push(x.dealerId);
          //使用逗号分隔拼接经销商名称
          if (this.dealerName == '') {
            this.dealerName = x.dealerName;
          } else {
            this.dealerName += ',' + x.dealerName;
          }
        });
        // this.dataSource = data.data;
        // let dealerList = [];
        // this.dataSource.forEach(x => {
        //   let dealer = {};
        //   // dealer.dealerId = x.dealerId;
        //   dealer.dealerName = x.dealerName;
        //   dealer.ownerCode = x.dealerCode;
        //   dealerList.push(dealer);
        // });
        // this.topFilterInit[0].initialValue = dealerList;
        this.topFilterInit[0].initialValue = this.dealerName;
      }

      this.visibleDealer = data.visible; //关闭弹窗
    },
    changeHandle(data) {
      var time = data.feedbackEndDate;
      data = Object.assign({}, { timestart: time[0] }, data);
      data = Object.assign({}, { timeend: time[1] }, data);
      data = Object.assign({}, { dealerCode: this.dealerCode }, data);
      this.dealerCode = '';
      this.fetchParams = Object.assign({}, data);
    },
    //取营销素材类型-一级
    async initmaterialTypeOne() {
      let res = [];
      this.dataParams = { parentTypeId: '' };
      let rd = await getmaterialTypeOneList(this.dataParams);
      for (let i in rd.data) {
        res.push({ text: rd.data[i].materialTypeName, value: rd.data[i].materialTypeId });
      }
      this.topFilterInit[6].itemList = res;
    },
    //取营销素材类型-二级
    async initmaterialTypeTwo(parentTypeId) {
      this.topFilterInit.find(item => item.fieldName === 'materialTypeTwo').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeThree').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeTwo').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeThree').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').itemList = [];
      if (parentTypeId != '') {
        let res = [];
        this.dataParams = { parentTypeId: parentTypeId };
        let rd = await getmaterialTypeOneList(this.dataParams);
        for (let i in rd.data) {
          res.push({ text: rd.data[i].materialTypeName, value: rd.data[i].materialTypeId });
        }
        this.topFilterInit[7].itemList = res;
      }
    },
    //取营销素材类型-三级
    async initmaterialTypeThree(parentTypeId) {
      this.topFilterInit.find(item => item.fieldName === 'materialTypeThree').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeThree').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').itemList = [];
      if (parentTypeId != '') {
        let res = [];
        this.dataParams = { parentTypeId: parentTypeId };
        let rd = await getmaterialTypeOneList(this.dataParams);
        for (let i in rd.data) {
          res.push({ text: rd.data[i].materialTypeName, value: rd.data[i].materialTypeId });
        }
        this.topFilterInit[8].itemList = res;
      }
    },
    //取营销素材类型-四级
    async initmaterialTypeFour(parentTypeId) {
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').itemList = [];
      if (parentTypeId != '') {
        let res = [];
        this.dataParams = { parentTypeId: parentTypeId };
        let rd = await getmaterialTypeOneList(this.dataParams);
        for (let i in rd.data) {
          res.push({ text: rd.data[i].materialTypeName, value: rd.data[i].materialTypeId });
        }
        this.topFilterInit[9].itemList = res;
      }
    },
    //取营销素材类型-五级
    async initmaterialTypeFive(parentTypeId) {
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').itemList = [];
      if (parentTypeId != '') {
        let res = [];
        this.dataParams = { parentTypeId: parentTypeId };
        let rd = await getmaterialTypeOneList(this.dataParams);
        for (let i in rd.data) {
          res.push({ text: rd.data[i].materialTypeName, value: rd.data[i].materialTypeId });
        }
        this.topFilterInit[10].itemList = res;
      }
    },
    async getUserInfo() {
      this.loginUser = await getLoginUser({});
      if (this.loginUser != null && this.loginUser != undefined) {
        if (this.loginUser.data.orgType == 15061005) {
          //是事业部
          this.orgId = this.loginUser.data.orgId;
        }
        // if (this.loginUser.data.orgType == 15061007) {
        //办事处 获取父类ID，赋给orgId
        // this.orgId = this.loginUser.data.orgId;
        // }
      }
    }
  },
  created() {
    //获取事业部下拉列表
    this.getDeptData();
    // this.getUserInfo();
  },
  mounted() {
    //初始化营销素材类型-一级
    this.initmaterialTypeOne();
  }
};
</script>

<style>
.cover-container {
  width: 70vw !important;
}
</style>
